<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>彩票报告</title>
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  <link href="../css/mui.min.css" rel="stylesheet" />
  <link rel="stylesheet" type="text/css" href="../css/timecheck.css" />
  <link rel="stylesheet" href="../fonts/iconfont.css" />
  <script>
    document.documentElement.style.fontSize = document.documentElement.clientWidth / 6.4 + 'px';
  </script>
  <style>
    html,
    body,
    #app {
      width: 100%;
      /*height: 100%;*/
      overflow-x: hidden;
      background-color: white;
    }
    body{
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0;
      bottom: 0;

    }
    /**/
    .formDiv{
      background-color: white;
    }
    .formDiv p{
      margin: 0;
      padding: 0;
      font-size: 0.24rem;
      color:black;
    }
    .formDiv>div{
      width:100%;
      overflow: hidden;
      padding: 0.1rem 4% 0.1rem 0;
    }
    .floatLeft{
      float: left;
    }

    .textLeft{
      text-align: left;
    }
    .textRight{
      text-align: right;
    }
    .bglight{
      background-color: #EEEEEE
    }
    .form-title{
      width: 100%;
      overflow: hidden;
      padding: 0.2rem 0.2rem 0.2rem 0;
      background-color: #EEEEEE;

    }
    .form-title p{
      float: left;
      text-align: center;
      padding: 0;
      margin: 0;
      color:black;
    }

  </style>
</head>
<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/mui.min.js"></script>
<script src="../common/timeCheck3.js" type="text/javascript" charset="utf-8"></script>

<body>
<div id="app" class="mui-content">
  <time-check :type='2' :dateType="dateType" :names='names' :leftdata="leftdata" :rightdata="rightdata" :actnum="actnum" :fromdate="fromDate" :todate='toDate' :top="top"></time-check>

  <div style="overflow: hidden;background-color: white;margin-bottom: 1rem ">
    <div class="form-title">
      <p style="width: 40%">设备名</p>
      <p style="width: 30%;text-align: right">人数</p>
      <p style="width: 30%;text-align: right">分数</p>
    </div>


    <div v-show="list.length !==0" class="formDiv" v-for="(item,index) in list" @click="toUserList(item)" :class="{bglight:index%2===1}" >
      <div style="padding: 0.2rem 0.2rem 0.2rem 0">
        <div class="floatLeft  textLeft" style="width: 40%;position: relative">
          <img  style="width: 0.35rem;position: absolute;top:0;"  src="../images/caipiao.png" alt="">
          <span style="font-size: 0.24rem;margin-left: 0.35rem"> {{item.deviceName}} </span>
        </div>
        <p  class="floatLeft  textRight" style="width: 30%;">{{item.peopleNum}}人</p>
        <p  class="floatLeft  textRight"  style="width: 30%;">{{item.scoreNum}}分</p>
      </div>
    </div>
    <p v-show="list.length ===0" style="width: 100%;text-align: center;margin-top: 0.5rem">暂无数据</p>
  </div>

</div>
<!---->
<script src="../config.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
  var vm = new Vue({
    el: '#app',
    data: function() {
      return {
        names: {
          leftName: '存票人数',
          rightName: '存票分数'
        },
        fromDate: '',
        toDate: '',
        actnum: 0,
        top:'1rem',
        dateType:'',
        leftdata:'',
        rightdata:'',
        list:[
          {
            "deviceId":299,
            "deviceModel":"155",
            "deviceName":"小娃娃机-2号机",
            "peopleNum":1,
            "scoreNum":2
          },
          {
            "deviceId":249,
            "deviceModel":"136",
            "deviceName":"魔力弹弹球-1号机",
            "peopleNum":2,
            "scoreNum":746
          }
        ],
        currentShopObj:''
      }
    },
    created: function() {
      var vm = this
      mui.init()
      mui.plusReady(function() {
        vm.receiveParams()
        vm.initTime()
      })
    },
    mounted:function(){

    },
    methods: {
      receiveParams: function() {
        var sf = plus.webview.currentWebview();
        this.currentShopObj = sf.currentShopObj;
        console.log(JSON.stringify(this.currentShopObj))
      },
      localData:function() {
        var  vm=this
        var data={
          "storeId":vm.currentShopObj.storeId,
          "fromTime":  new Date(vm.fromDate + ' 00:00:00').getTime() ,
          "endTime":new Date(vm.toDate + ' 23:59:59').getTime()
        };
        console.log(JSON.stringify(data))
        config.ajax({
          url:'/scores/getCleanFlows',
          data: {
            "storeId":vm.currentShopObj.storeId,
            "fromTime":  new Date(vm.fromDate+ ' 00:00:00' ).getTime() ,
            "endTime":new Date(vm.toDate + ' 23:59:59').getTime()
          },
          success: function(res) {
              console.log(JSON.stringify(res))
            if(res.result===1){
              vm.list=res.cleanTicketFlowsVo  === null ? [] : res.cleanTicketFlowsVo.cleanTicketFlows;
              vm.leftdata=res.cleanTicketFlowsVo  === null ? 0 : res.cleanTicketFlowsVo.totalPeopleNum;
              vm.rightdata=res.cleanTicketFlowsVo  === null ? 0 :res.cleanTicketFlowsVo.totalScore;
            }

          }
        });
      },
      initTime: function() {
        //						默认时间为日
        this.date = new Date()
        this.fromDate=new Date(this.date).format('yyyy-MM-dd')
        this.toDate = new Date(this.date).format('yyyy-MM-dd')
      },
      toUserList:function(item){
        var  vm=this
        mui.openWindow({
          url: 'peopleJournalDetail.html',
          id: 'peopleJournalDetail',
          styles: {
            titleNView: {
              titleText: '人工存积分日志',
              titleColor: "#FFFFFF",
              titleSize: "17px",
              backgroundColor: "#FF6800",
              autoBackButton: true,
              buttons: [{
                fontWeight: 'normal',
                fontSize: '18px',
                float: 'right',
                fontSrc: "_www/fonts/iconfont.ttf", //wap2app内置字体文件
                text: "\ue602",
                onclick: function() {
                  var allPage = plus.webview.all()
                  var nowPage = plus.webview.getWebviewById('index')
                  for(var i = 0; i < allPage.length; i++) {
                    if(allPage[i].getURL() !== nowPage.getURL()) {
                      plus.webview.close(allPage[i]);
                    }
                  }
                }
              }],
              splitLine: {
                color: "#CCCCCC",
                height: "1px"
              }
            }
          },
          extras: {
            currentShopObj: vm.currentShopObj,
            deviceId:item.deviceId,
            fromTime:vm.fromDate,
            endTime:vm.toDate,
            totalInfo:item,
          }
        });


      }

    },
    watch: {
      fromDate: function() {
        this.localData()
      }
    }
  })
</script>
</body>

</html>